<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title>标题</title>
</head>
<body>
<input type="button" value="获取" id="getBtn"/>
<input type="button" value="设置" id="setBtn"/>

<div id="div1">我是一个div标签
  <p>我是一个p标签 <span>span1</span></p>
</div>

<div>我是一个div2标签
  <p>我是一个p2标签 <span>span2</span></p>
</div>

</body>
</html>
<script src="jquery-1.12.4.js"></script>
<script>
  $(function () {
    //text();  获取和设置文本的.

    //1.获取文本: text()方法不给参数
    $('#getBtn').click(function () {
      //1.1 获取id为div1这个标签的文本
      //会获取到这个标签中所有的文本,包括后代元素的文本.
      //console.log($('#div1').text());

      //1.2 获取标签为div的元素的文本
      //包含了多个dom元素的jQuery对象,通过text()方法获取文本,会把所有dom元素的文本获取到.
      console.log($('div').text());
    });

    //2.设置文本: text()方法给参数,参数就是要设置的文本
    $('#setBtn').click(function () {
      //2.1 给id为div1的这个标签设置文本
      //会覆盖他原来的内容,如果设置的文本中包含标签,是不会把这个标签给解析出来的.
      // $('#div1').text('我是新设置的文本');
      // $('#div1').text('我是新设置的文本<a>我是连接</a>');

      //2.2 给标签为div的元素设置文本
      //包含了多个dom元素的jQuery对象,通过text()方法设置文本,会把所有的dom元素都设置上.
      $('div').text('设置的文本'); //隐式迭代.
    });



  });
</script>